<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commonjsp/jstl.jsp"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>工单核算</title>
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" type="text/css" href="${prefix}/stylesheets/theme.css">
<link rel="stylesheet" type="text/css" href="${prefix}/stylesheets/reveal.css">
<link rel="stylesheet" type="text/css" href="${prefix}/lib/font-awesome/css/font-awesome.css">
<link rel="stylesheet" type="text/css" href="${prefix}/lib/bootstrap/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="${prefix}/lib/jqueryui/jquery-ui.css">
<link rel="stylesheet" type="text/css" href="${prefix}/lib/jqueryui/jquery-ui.structure.css">
<link rel="stylesheet" type="text/css" href="${prefix}/lib/jqueryui/jquery-ui.theme.css">

<script src="${prefix}/lib/jquery-1.8.1.min.js" type="text/javascript"></script>
<script src="${prefix}/lib/ajaxfileupload.js" type="text/javascript"></script>
<script src="${prefix}/lib/jquery-form.js" type="text/javascript"></script>
<script src="${prefix}/lib/jquery.reveal.js" type="text/javascript"></script>
<script src="${prefix}/lib/jqueryui/jquery-ui.js" type="text/javascript"></script>
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
	<script src="${prefix}/javascripts/html5.js"></script>
<![endif]-->
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="${prefix}/lib/font-awesome/docs/assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" href="${prefix}/lib/font-awesome/docs/assets/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="${prefix}/lib/font-awesome/docs//assets/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="${prefix}/lib/font-awesome/docs//assets/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="${prefix}/lib/font-awesome/docs//assets/ico/apple-touch-icon-57-precomposed.png">
</head>
<script type="text/javascript">
$(document).ready(function () {
	//=====页面准备好以后，查询该操作者可以进行操作的店面和公司信息
	queryCompanyAndStoreSelect();
	
	//当店面选择发生变化时
	$("#companyandstoreid").change(function() {
		$("#search_orderMode").val("");
		$("#search_orderStatus").val("");
		$("#search_waiter").val("");
		$("#search_roomNo").val("");
		preQueryTaskOrderByStoreid();
	});
	
	//准备工单详情的弹出框
	$("#orderinfoDetails").dialog({
		resizable: false,
		height: 520,
		width: 420,
		modal: true,
		autoOpen: false,
		show: {
		  effect: "blind",
		  duration: 300
		},
		hide: {
		  effect: "explode",
		  duration: 300
		}
	});
	
	//准备工单核算详情对话框
	$("#orderinfoAccountDetail").dialog({
		resizable: false,
		height: 520,
		width: 600,
		modal: true,
		autoOpen: false,
		show: {
		  effect: "blind",
		  duration: 300
		},
		hide: {
		  effect: "explode",
		  duration: 300
		}
	});
	
	//当重新输入“实际积分”并且回车时
	$("#account_realIntegral").keyup(function(e) {
		var realIntegral = $.trim($("#account_realIntegral").val());
		var account_orderTypeCode = $.trim($("#account_orderTypeCode").val());
		if(e.keyCode == 13) {
			var pattern = /^[\d]+$/;
			if(!pattern.test(realIntegral)) {
				alert("错误的积分数据，请检查！");
				return;
			}
			
			//根据条件进入下一个可输入框
			if(account_orderTypeCode == "0001") {
				$("#account_realtotalAmount").focus();
			} else {
				saveOrderinfoAccount();
			}
		}
	});
	
	//当“实付金额”输入框有回车出现时
	$("#account_realtotalAmount").keyup(function(e) {
		var account_realtotalAmount = $.trim($("#account_realtotalAmount").val());
		if(e.keyCode == 13) {
			var pattern = /^[\d]+[.]?[\d]?[\d]?$/;
			if(!pattern.test(account_realtotalAmount)) {
				alert("错误的金额数据，请检查！");
				return;
			}
			
			saveOrderinfoAccount();
		}
	});
});

//查询该操作者可以进行操作的店面和公司信息
function queryCompanyAndStoreSelect() {
	$.ajax({
		type: "post", 
		async: false, 
		url: "${prefix}/company/queryCompanyAndStoreList", 
		success: function(data) { 
			var jsonData = eval('(' + data + ')');
			var listDatas = jsonData.data;
			var optionhtml = ""; 
			for(var index = 0 ; listDatas != null && index < listDatas.length ; index++) { 
				var optionItem = listDatas[index]; 
				
				optionhtml += "<optgroup id=\"" + optionItem.companyuid + "\" label=\"" + optionItem.companyName + "\" style=\"color: #FF00FF;margin: 8px\"></optgroup>";
				var stores = optionItem.stores;
				for(var sum = 0 ; stores != null && sum < stores.length ; sum++) {
					var storeItem = stores[sum];
					optionhtml += "<option style=\"margin: 5px\" companyid=\"" + optionItem.companyuid + "\" value=\"" + storeItem.storeuid + "\"";
					if(index == 0 && sum == 0) {
						optionhtml += " selected ";
					}
					optionhtml += ">" + storeItem.storeName + "</option>";
				}
			}
			
			$("#companyandstoreid").html(optionhtml);
			preQueryTaskOrderByStoreid();
		}
	});
}

//查询指定的店面待核算工单，
function preQueryTaskOrderByStoreid() {
	storeid = $("#companyandstoreid").val();
	data = "storefrontid=" + storeid;
	//可能的查询条件
	var orderMode = $.trim($("#search_orderMode").val());
	var waiterCode = $.trim($("#search_waiter").val());
	var roomNo = $.trim($("#search_roomNo").val());
	if(orderMode != ""){
		data += "&orderMode=" + orderMode;
	}
	if(waiterCode != ""){
		data += "&waiterCode=" + waiterCode;
	}
	if(roomNo != ""){
		data += "&roomNo=" + roomNo;
	}
	
	$.ajax({
		type: "post",
		async: true,
		dataType: "json",
		url: "${prefix}/order/queryAccountOrders",
		data: data,
		success: function(jsonData) {
			//错误信息
			if(jsonData.responsecode != "E200") {
				alert(jsonData.errorinfo);
				return;
			}
			
			reviewTables(jsonData.data)
		}
	});
}

//当收到表格数据后，由这个方法进行表格重绘
function reviewTables(jsonobjects) {
	$("#usertablebodyDiv").html("");
	var htmlbody = "";
	for(var index = 0 ; jsonobjects != null && index < jsonobjects.length ; index++) {
		var orderinfoItem = jsonobjects[index];
		//根据积分获得情况，显示不同的字体颜色
		if(orderinfoItem.integral > orderinfoItem.realIntegral) {
			htmlbody += "<tr  style=\"color: #AA4444\">";
		} else if(orderinfoItem.integral < orderinfoItem.realIntegral) {
			htmlbody += "<tr  style=\"color: #44AA44\">";
		} else {
			htmlbody += "<tr>";
		}
		//复选框（消费单涉及金额，不能批量结算）
		if(orderinfoItem.orderTypeCode == "0001") {
			htmlbody += "<td>&nbsp;</td>";
		} else {
			htmlbody += "<td><input type=\"checkbox\" name=\"orderinfoChecked\" value=\"" + orderinfoItem.uid + "\" realIntegral=\"" + orderinfoItem.realIntegral + "\"/></td>";
		}
		
		htmlbody += "<td>" + orderinfoItem.roomNo + "</td>";
		//派单方式
		if(orderinfoItem.orderMode == 1) {
			htmlbody += "<td>" +  orderinfoItem.orderTypeName + "[抢单]</td>";
		} else {
			htmlbody += "<td>" +  orderinfoItem.orderTypeName + "[指派]</td>";
		}
		//服务员
		htmlbody += "<td>" + orderinfoItem.realName + "[" + orderinfoItem.workNumber + "]" + "</td>";
		//指派时间
		var appointeTime = orderinfoItem.appointeTime;
		htmlbody += "<td>" + appointeTime.split(" ")[1] + "</td>";
		//耗时
		htmlbody += "<td>" + orderinfoItem.realDuration + "</td>";
		//客户付款
		htmlbody += "<td>$" + orderinfoItem.totalAmount + "</td>";
		//核算积分
		htmlbody += "<td><label>标准积分:" + orderinfoItem.integral + "，获得:" + orderinfoItem.realIntegral + "</label><label>" + orderinfoItem.realIntegralRemark + "</label></td>";
		//功能
		htmlbody += "<td style=\"width: 120px\">";
		htmlbody += "<a href=\"javascript:void(0);\" onclick=\"viewOrderInfo('" + orderinfoItem.uid + "')\" style=\"margin-right:10px\">详情</a>";
		htmlbody += "<a href=\"javascript:void(0);\" onclick=\"showOrderAccount('" + orderinfoItem.uid + "')\" style=\"margin-right:10px\">核算</a>";
		htmlbody += "</td>";
		htmlbody += "</tr>";
	}
	
	$("#orderinfoTBodyDiv").html(htmlbody);
}

//查看一个工单的详情
function viewOrderInfo(orderinfoid) {
	$.ajax({
		type: "post",
		async: false,
		dataType: "json",
		url: "${prefix}/order/queryOrderinfoDetails?orderinfoid=" + orderinfoid,
		success: function(jsonData) {
			//错误信息
			if(jsonData.responsecode != "E200") {
				alert(jsonData.errorinfo);
				return;
			}
			
			var orderinfo = jsonData.data;
			//显示弹出框
			$("#orderinfoDetails").dialog("open");
			
			//赋值
			//当前状态
			if(orderinfo.orderStatus == 1) {
				$("#orderStatus").html("正在抢单");
			} else if(orderinfo.orderStatus == 2){
				$("#orderStatus").html("已派单");
			} else if(orderinfo.orderStatus == 3){
				$("#orderStatus").html("已完成服务【等待结算】");
			} else if(orderinfo.orderStatus == 4){
				$("#orderStatus").html("已结算");
			}
			//门牌号
			$("#roomNo").html(orderinfo.roomNo);
			$("#orderType").html(orderinfo.orderType.orderTypeName + "[" + orderinfo.orderType.orderCode + "]")
			$("#duration").html(orderinfo.duration);
			$("#integral").html(orderinfo.integral);
			//确定工单指派单模式
			if(orderinfo.orderMode == 1) {
				$("#fenpeiType").html("抢单模式");
			} else {
				$("#fenpeiType").html("分配模式");
			}
			//服务员工
			if(orderinfo.waiter == null) {
				$("#userCode").html("未指定/未指派");
				$("#userCode").css("color","#FF1122");
			} else {
				$("#userCode").html(orderinfo.waiter.realName + "[" + orderinfo.waiter.workNumber + "]");
				$("#userCode").css("color","");
			}
			//指派时间
			$("#appointeTime").html(orderinfo.appointeTime);
			//服务完成时间
			$("#serviceOverTime").html(orderinfo.serviceOverTime);
			
			//商品信息
			if(orderinfo.orderType.orderCode == '0001') {
				$("#commodityDetailsDiv").css("display","");
				var commodityMappings = orderinfo.commoditys;
				var html = "";
				for(var index = 0 ; commodityMappings != null && index < commodityMappings.length ; index++) {
					var commodityM = commodityMappings[index];
					html += "<tr>";
					html += "<td>" + commodityM.commodify.commodityName + "[" + commodityM.commodify.sortName + "]</td>";
					html += "<td>" + commodityM.commodifyNumber + "</td>";
					html += "</tr>";
				}
				$("#commodityDetailsTbody").html(html);
				$("#remarkDetailsDiv").css("display","none");
			} 
			//非“消费单”模式
			else {
				$("#commodityDetailsDiv").css("display","none");
				$("#remarkDetailsDiv").css("display","");
				$("#remark").val(orderinfo.remark);
			} 
		}
	});
}

//选中或者取消选中所有的订单信息
function allOrderinfoChecked() {
	if($("#allChecked").attr('checked')) {
		$("input[name='orderinfoChecked']").attr('checked',true);
	} else {
		$("input[name='orderinfoChecked']").attr('checked',false);
	}
}

//显示指定工单的结算详情，并且在页面上允许管理者对结算数据进行调整
function showOrderAccount(orderinfoid) {
	$.ajax({
		type: "post",
		async: false,
		dataType: "json",
		url: "${prefix}/order/queryAccountOrder?orderinfoid=" + orderinfoid,
		success: function(jsonData) {
			//错误信息
			if(jsonData.responsecode != "E200") {
				alert(jsonData.errorinfo);
				return;
			}
			
			var orderinfo = jsonData.data;
			//显示弹出框
			$("#account_uid").val(orderinfo.uid);
			$("#account_orderTypeCode").val(orderinfo.orderTypeCode);
			//门牌号
			$("#account_roomNo").html(orderinfo.roomNo);
			$("#account_orderType").html(orderinfo.orderTypeName + "[" + orderinfo.orderTypeCode + "]")
			$("#account_duration").html(orderinfo.duration);
			$("#account_integral").html(orderinfo.integral);
			//确定工单指派单模式
			if(orderinfo.orderMode == 1) {
				$("#account_fenpeiType").html("抢单模式");
			} else {
				$("#account_fenpeiType").html("分配模式");
			}
			//服务员工
			$("#account_userCode").html(orderinfo.realName + "[" + orderinfo.workNumber + "]");
			$("#account_userCode").css("color","");
			//指派时间
			$("#account_appointeTime").html(orderinfo.appointeTime);
			//服务完成时间
			$("#account_serviceOverTime").html(orderinfo.serviceOverTime);
			
			//标准耗时
			$("#account_duration").html(orderinfo.duration);
			//标准积分
			$("#account_integral").html(orderinfo.integral);
			//实际耗时
			$("#account_realDuration").html(orderinfo.realDuration);
			//实际积分
			$("#account_realIntegral").val(orderinfo.realIntegral);
			//调理依据
			$("#account_realIntegralRemark").html(orderinfo.realIntegralRemark);
			
			if(orderinfo.orderTypeCode == "0001") {
				$("#accountAmountDiv").css("display","");
				//客户应付款
				$("#account_totalAmount").html(orderinfo.totalAmount);
				//客户实际付款
				$("#account_realtotalAmount").val(orderinfo.totalAmount);
			} else {
				$("#accountAmountDiv").css("display","none");
				//客户应付款
				$("#account_totalAmount").html("");
				//客户实际付款
				$("#account_realtotalAmount").val("");
			}
			
			//商品信息
			if(orderinfo.orderTypeCode == "0001") {
				$("#account_commodityDetailsDiv").css("display" , "");
				$("#account_commodityDetailsDiv").css("display","");
				var commoditys = orderinfo.commoditys;
				var html = "";
				for(var index = 0 ; commoditys != null && index < commoditys.length ; index++) {
					var commodity = commoditys[index];
					html += "<tr>";
					html += "<td>" + commodity.commodityName + "[" + commodity.sortName + "]</td>";
					html += "<td>" + commodity.commodifyNumber + "</td>";
					html += "</tr>";
				}
				$("#account_commodityDetailsTbody").html(html);
				$("#account_remarkDetailsDiv").css("display","none");
				$("#account_remark").html("");
			} else {
				$("#account_commodityDetailsDiv").css("display" , "none");
				$("#account_commodityDetailsTbody").html("");
				$("#account_remarkDetailsDiv").css("display","");
				$("#account_remark").html(orderinfo.remark);
			}
			
			//显示对话框
			$("#orderinfoAccountDetail").dialog("open");
		}
	});
}

//该方法用于保存指定的工单的核算信息
function saveOrderinfoAccount() {
	var account_uid = $.trim($("#account_uid").val());
	var account_realIntegral = $.trim($("#account_realIntegral").val());
	var account_realtotalAmount = $.trim($("#account_realtotalAmount").val());
	var account_orderTypeCode = $.trim($("#account_orderTypeCode").val());
	
	//首先进行填写数据的判断
	var goodForm = true;
	var error = "";
	var pattern = /^[\d]+$/;
	if(!pattern.test(account_realIntegral)) {
		goodForm = false;
		error += "请输入正确的“实际积分”\n";
	}
	pattern = /^[\d]+[.]?[\d]?[\d]?$/;
	if(!pattern.test(account_realtotalAmount) && account_orderTypeCode == "0001") {
		goodForm = false;
		error += "请输入正确的“实付金额”\n";
	}
	if(!goodForm) {
		alert(error);
		return;
	}
	
	//然后请求服务器，对这个指定工单进行核算操作
	var data = "";
	if(account_orderTypeCode == "0001") {
		data = "orderinfoid=" + account_uid + "&realIntegral=" + account_realIntegral + "&realTotalAmount=" + account_realtotalAmount;
	} else {
		data = "orderinfoid=" + account_uid + "&realIntegral=" + account_realIntegral;
	}
	$.ajax({
		type: "post",
		async: false,
		dataType: "json",
		url: "${prefix}/order/saveOrderinfoAccount",
		data: data,
		success: function(jsonData) {
			//错误信息
			if(jsonData.responsecode != "E200") {
				alert(jsonData.errorinfo);
				return;
			}
			
			//成功后，关闭对话框再重新查询“待核算”列表
			$("#orderinfoAccountDetail").dialog("close");
			preQueryTaskOrderByStoreid();
		}
	});
}

//批量核算。批量核算不能对系统预算的实际积分数据进行更改
function saveOrderinfoAccounts() {
	var orderinfos = $("input[name='orderinfoChecked']");
	if(orderinfos == null || orderinfos.length == 0) {
		alert("请勾选至少一个结算工单!");
		return;
	}
	
	//构造data
	var data = "";
	for(var index = 0 ; index < orderinfos.length ; index++) {
		var orderinfo = orderinfos[index];
		if(!($(orderinfo).attr("checked") && $(orderinfo).attr("checked") == "checked")) {
			continue;
		}
		var orderinfoid = $(orderinfo).val();;
		var realintegral = $(orderinfo).attr("realintegral");
		
		if(index == 0) {
			data += "orderinfoid=" + orderinfoid + "&realIntegral=" + realintegral;
		} else {
			data += "&orderinfoid=" + orderinfoid + "&realIntegral=" + realintegral;
		}
	}
	if(data == "") {
		alert("请选择至少一个工单信息！");
		return;
	}
	if(!window.confirm("使用批量核算将不能调整实际积分，您确定进行批量结算吗？")) {
		return;
	}
	
	$.ajax({
		type: "post",
		async: false,
		dataType: "json",
		url: "${prefix}/order/saveOrderinfoAccounts",
		data: data,
		success: function(jsonData) {
			//错误信息
			if(jsonData.responsecode != "E200") {
				alert(jsonData.errorinfo);
				return;
			}
			
			preQueryTaskOrderByStoreid();
		}
	});
}
</script>

<!--[if lt IE 7 ]> <body class="ie ie6"> <![endif]-->
<!--[if IE 7 ]> <body class="ie ie7"> <![endif]-->
<!--[if IE 8 ]> <body class="ie ie8"> <![endif]-->
<!--[if IE 9 ]> <body class="ie ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> 
<body>
<!--<![endif]-->

<div class="navbar">
	<%@ include file="/commonjsp/userbar.jsp"%>
</div>

<div class="container-fluid">
	<div class="row-fluid">
		<%@ include file="/commonjsp/mainmenu.jsp"%>
		<!-- 列表 -->
		<div class="span9">
			<!-- 列表头 -->
			<h1 class="page-title">工单核算</h1>
			
			<!-- 店面列表 -->
			<div class="well" style="width: 160px;height: 480px; float: left; margin-right:10px ; padding: 10px">
				<input type="hidden" name="admin_name" id="admin_name" value="${admin.userName }"/>
				<input type="hidden" name="admin_level" id="admin_level" value="${admin.adminLevel }"/>
				<input type="hidden" name="admin_companyid" id="admin_companyid" value="${admin.company.uid }"/>
				<input type="hidden" name="admin_storeid" id="admin_storeid" value="${admin.storefront.uid }"/>
				<select style="width: 100% ; height: 100% ; border: 0px" multiple="multiple" id="companyandstoreid" name="companyandstoreid">
					
				</select>
			</div>
			
			<div class="well" style="float: left; min-width: 900px; margin-bottom: 5px ; padding-bottom: 10px">
				<label style="padding-right: 10px;float: left; ">派单模式：
					<select id="search_orderMode" style="width: 120px; height: 30px">
						<option value=""> -- 请选择 --  </option>
						<option value="1"> 抢单模式 </option>
						<option value="2"> 指派模式 </option>
					</select>
				</label>
				<label style="float: left; padding-right: 10px">
					办理人工号：<input id="search_waiter" type="text" value="" maxlength="10" style="width: 120px; height: 30px"/>
				</label>
				<label style="float: left; padding-right: 10px">
					房间号：<input id="search_roomNo" type="text" value="" maxlength="10" style="width: 120px; height: 30px"/>
				</label>
				<label style="float: left; padding-right: 10px">
					<a id="savebutton" onclick="preQueryTaskOrderByStoreid()" class="btn btn-primary"> Search</a>
					<a id="savebutton" onclick="saveOrderinfoAccounts()" class="btn"> 批量结算 </a>
				</label>
			</div>
			
			<!-- 列表正文 -->
			<div class="well" style="float: left; min-width: 900px; margin-top: 5px">
				<table class="table">
					<thead>
						<tr>
							<th><input type="checkbox" name="allChecked" id="allChecked" onclick="allOrderinfoChecked()"></th>
							<th>房号</th>
							<th>类型与模式</th> 
							<th>办理人</th>
							<th>指派时间</th>
							<th>耗时(秒)</th>
							<th>客户付款</th>
							<th>核算积分</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody id="orderinfoTBodyDiv">
						
					</tbody>
				</table>
			</div>
		</div>
	</div>
	
	<!-- Le javascript
	================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="${prefix}/lib/bootstrap/js/bootstrap.js"></script>
	
	<!-- 工单详情 -->	
	<div id="orderinfoDetails">
		<label>当前状态：
			<font id="orderStatus" style="font-size: 18;font-weight: bold;color: #FF00FF"></font>
		</label>
		<label>房间号：
			<font id="roomNo"></font>
		</label>
		<label>工单类型（请输入类型编号）：
			<font id="orderType"></font>
		</label>
		<label>标准服务时间(秒)：
		<font id="duration"></font>
		</label>
		<label>工单积分：
		<font id="integral"></font>
		</label>
		<label>
		工单分配方式：
		<font id="fenpeiType"></font>
		</label>
		
		<label>服务员工：
		<font id="userCode"></font> 
		</label>
		<label>指派时间：
		<font id="appointeTime"></font> 
		</label>
		<label>服务完成时间：
		<font id="serviceOverTime"></font> 
		</label>
		
		<!-- 商品信息 -->
		<div id="commodityDetailsDiv" style="display:none">
			<table class="table">
				<thead>
				<tr>
					<th>商品名称</th>
					<th>商品数量</th>
				</tr>
				</thead>
				<tbody id="commodityDetailsTbody">
					
				</tbody>
			</table>
		</div>
		
		<!-- 任务说明 -->
		<div id="remarkDetailsDiv">
		<label>任务说明：</label>
		<textarea style="width: 320px;height: 160px" id="remark" readonly="readonly"></textarea>
		</div>
	</div>
	
	<!-- 工单核算 -->	
	<div id="orderinfoAccountDetail">
		<label>
			<font style="font-size: 18;font-weight: bold;color: #FF00FF">工单核算</font>
			<input type="hidden" id="account_uid">
			<input type="hidden" id="account_orderTypeCode">
		</label>
		<label>房间号：
			<font id="account_roomNo"></font>
		</label>
		<label>工单类型：
			<font id="account_orderType"></font>
		</label>
		<label>
		工单分配方式：
		<font id="account_fenpeiType"></font>
		</label>
		
		<label>服务员工：
		<font id="account_userCode"></font> 
		</label>
		<label>
		<font>指派时间：</font>
		<font id="account_appointeTime"></font> 
		<font style="margin-left: 10px">服务完成时间：</font>
		<font id="account_serviceOverTime"></font> 
		</label>
		
		<label>
		<font>标准耗时(秒)：</font>
		<font id="account_duration"></font> 
		<font style="margin-left: 10px">实际耗时(秒)：</font>
		<font id="account_realDuration"></font> 
		</label>
		
		<label>
		<font>标准积分：</font>
		<font id="account_integral"></font> 
		<font style="margin-left: 10px">实际积分：</font>
		<input id="account_realIntegral" type="text" maxlength="6" style="width: 50px"/> 
		</label>
		
		<label style="font-weight:bolder;">条例依据：
		<font id="account_realIntegralRemark"></font> 
		</label>
		<div id="accountAmountDiv" style="display:none">
		<label>
		<font>客户应付款：</font>
		<font id="account_totalAmount"></font> 
		<font style="margin-left: 10px">客户实付款：</font>
		<input id="account_realtotalAmount" type="text" maxlength="6" style="width: 50px"/> 
		</label>
		</div>
		
		<!-- 商品信息 -->
		<div id="account_commodityDetailsDiv" style="display:none">
			<table class="table">
				<thead>
				<tr>
					<th>商品名称</th>
					<th>商品数量</th>
				</tr>
				</thead>
				<tbody id="account_commodityDetailsTbody">
					
				</tbody>
			</table>
		</div>
		
		<!-- 任务说明 -->
		<div id="account_remarkDetailsDiv">
		<label>任务说明：</label>
		<textarea style="width: 500px;height: 100px" id="account_remark" readonly="readonly"></textarea>
		</div>
	</div>
</div>
</body>
</html>